<template>
    <div class="box">
        <div class="inner">
            <h1 style="font-size: 20px;">你关注的博主</h1>
            <div class="item" v-for="o in 20">
                <div class="head-h">
                    dijkstra求单元最短路
                </div>
                <div class="body">
                    给定一个n个点m条边的有向图，图中可能存在重边和自环，所有边权均为正值。请你求出1号点到n号点的最短距离，如果无法从1号点走到n号点，则输出-1。
                </div>
                <div class="foot-f">
                    <img src="../../assets/img/timg.jpg" />
                    <h>张超</h>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "dynamic"
    }
</script>

<style scoped>
    .box{
        width: 100%;
    }
    .inner{
        width: 900px;
        margin: 0 auto;
    }
    .inner .item{
        width: 400px;
        height: 130px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
        padding: 10px;
        cursor: pointer;
        transition: 0.3s;
        display: inline-block;
        margin-left: 20px;
        margin-top: 20px;
    }
    .inner .item:hover{
        -webkit-box-shadow: 0 0 8px 0 rgba(187,148,68,.26);
        box-shadow: 0 0 8px 0 rgba(187,148,68,.26);


    }
    .inner .item .head-h{
        font-weight: bold;
        cursor: pointer;
    }
    .inner .item .head-h:hover{
        color: #f40;
    }
    .inner .item .body{
        margin-top: 5px;
        color: #8a8a8a;
        font-size: 14px;
        line-height: 24px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        line-height: 20px;

    }
    .inner .item .foot-f {
        margin-top: 20px;
        position: relative;
    }
    .inner .item.foot-f img{
        width: 30px;
        height: 30px;
        border-radius: 50%;
        cursor: pointer;
    }

    .inner .item .foot-f img{
        width: 30px ;
        height: 30px ;
        border-radius: 50%;
    }
    .inner .item .foot-f h{
        display: inline-block;
        position: absolute;
        top: 5px;
        margin-left: 8px;
        cursor: pointer;
    }
    .inner .item .foot-f h:hover{
        color: #f40;
    }
</style>